<template>
  <a-modal
    class="add-modal"
    :visible="productVisible"
    :maskClosable="false"
    :destroyOnClose="true"
    :keyboard="false"
    @cancel="closeModal(false)"
    @ok="handSubmit"
    width="1200px"
  >
    <a-tabs
      :default-active-key="activeKey"
      @change="tabsChange"
      :forceRender="true"
    >
      <a-tab-pane :key="1" tab="图库">
        <Gallery
          ref="gallery"
          :defaultId="defaultId"
          :defaultRowsList="chooseIdList"
        ></Gallery>
      </a-tab-pane>
      <a-tab-pane :key="2" tab="案例">
        <Case
          ref="case"
          :defaultId="defaultId"
          :defaultRowsList="chooseIdList"
        ></Case>
      </a-tab-pane>
      <a-tab-pane :key="3" tab="视频">
        <videoTable
          ref="video"
          :defaultId="defaultId"
          :defaultRowsList="chooseIdList"
        ></videoTable>
      </a-tab-pane>
    </a-tabs>
  </a-modal>
</template>

<script>
import Gallery from "./gallery.vue";
import Case from "./case.vue";
import videoTable from "./videoTable.vue";
export default {
  name: "addProduct",
  components: {
    Gallery,
    Case,
    videoTable,
  },
  props: {
    productVisible: {
      // 是否显示弹窗
      type: Boolean,
      default: false,
    },
    chooseIdList: {
      type: Array,
      default() {
        return [];
      },
    },
  },
  computed: {
    defaultId() {
      let arr = [];
      arr = this.chooseIdList.map((item) => {
        return item.id;
      });
      return arr;
    },
  },
  watch: {
    productVisible(y) {
      if (y) {
        this.activeKey = 1;
      }
    },
  },
  data() {
    return {
      activeKey: 1,
      // oldIdList: [],
      // oldRows: [],
    };
  },
  created() {
    // this.oldRows = JSON.parse(JSON.stringify(this.chooseIdList));
    // this.oldIdList = this.oldRows.map((item) => {
    //   return item.id;
    // });
  },
  mounted() {},
  methods: {
    tabsChange(val) {
      this.activeKey = val;
    },
    closeModal(bool) {
      this.$emit("cancel", bool);
    },
    handSubmit() {
      // if (this.activeKey == 1) {
      //   // this.$emit(
      //   //   "comfirm",
      //   //   this.$refs.gallery.allSelectedRows,
      //   //   this.activeKey
      //   // );
      //   console.log(this.$refs.gallery.allSelectedRows);
      // } else if (this.activeKey == 2) {
      //   console.log(this.$refs.case.allSelectedRows);
      //   // this.$emit("comfirm", this.$refs.case.allSelectedRows, this.activeKey);
      // } else if (this.activeKey == 3) {
      //   console.log(this.$refs.video.allSelectedRows);
      //   // this.$emit("comfirm", this.$refs.video.allSelectedRows, this.activeKey);
      // }
      console.log(this.chooseIdList);
      let arr = [];
      this.chooseIdList.forEach((item) => {
        arr.push({
          id: item.id,
          name:
            item.galleryProductName ||
            item.caseProductName ||
            item.title ||
            item.name,
          type: item.galleryProductName
            ? "1"
            : item.caseProductName
            ? "2"
            : item.title
            ? "3"
            : item.type,
        });
      });
      this.$emit("comfirm", arr);
      this.$emit("cancel", false);
    },
  },
};
</script>

<style scoped lang="less">
</style>
